<template>
  <ant-modal modalWidth="576" modalHeight="600" :visible="open" :modal-title="formTitle" :adjust-size="true" @cancel="cancel">
    <a-form-model ref="form" :model="form" :rules="rules" slot="content" layout="vertical">
      <a-row :gutter="32">
        <a-col :span="12">
          <a-form-model-item label="审核配置名称" prop="name">
            <a-input v-model="form.name" placeholder="请输入审核配置名称" />
          </a-form-model-item>
        </a-col>
        <a-col :span="12" v-if="!modelItemDisabled">
          <a-form-model-item label="审核配置项目" prop="itemId">
            <select-region v-model="form.itemId" placeholder="请选择审核配置项" />
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="审核方式" prop="method">
            <a-select
              placeholder="请选择审核方式"
              v-model="form.method"
              :getPopupContainer="
                triggerNode => {
                  return triggerNode.parentNode || document.body
                }
              "
              style="width: 100%"
              allow-clear
            >
              <a-select-option v-for="(d, index) in methodOptions" :key="index" :value="d.dictValue">{{ d.dictLabel }}</a-select-option>
            </a-select>
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="审核状态" prop="status">
            <a-radio-group v-model="form.status" :defaultValue="form.status">
              <a-radio v-for="(dict, index) in statusOptions" :key="index" :value="dict.dictValue">
                {{ dict.dictLabel }}
              </a-radio>
            </a-radio-group>
          </a-form-model-item>
        </a-col>

        <a-col :span="24">
          <a-form-model-item label="审核原因" prop="sentence">
            <a-table :columns="columns" :data-source="sentenceList" :scroll="{ y: 200 }" style="width: 100%" rowKey="id" :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }">
              <div class="table-operations" slot="title" style="text-align: right">
                <a-button type="primary" size="small" @click="addRow"> <a-icon type="plus" />新增 </a-button>
                <a-button type="danger" v-if="!multiple" @click="batchDedeleteRow"> <a-icon type="delete" />删除 </a-button>
              </div>
              <template slot="value" slot-scope="text, record">
                <span v-if="!record.editable">
                  {{ text }}
                </span>
                <a-input placeholder="请输入" v-model="record.value" v-if="record.editable" style="width: 100%" />
              </template>
              <template slot="operation" slot-scope="text, record">
                <div v-if="record.editable">
                  <a @click="saveRow(record)">保存</a>
                  <a-divider type="vertical" />
                  <a @click.stop="cancelEditCell(record)">取消</a>
                </div>
                <div v-else>
                  <a @click.stop="updateRow(record)">修改</a>
                  <a-divider type="vertical" />
                  <a @click.stop="deleteRow(record)">删除</a>
                </div>
              </template>
            </a-table>
          </a-form-model-item>
        </a-col>
      </a-row>
      <a-row :gutter="32"> </a-row>
    </a-form-model>
    <template slot="footer">
      <a-button :disabled="disabled" @click="cancel"> 取消 </a-button>
      <a-button type="primary" :disabled="disabled" @click="submitForm(true)"> 保存 </a-button>
    </template>
  </ant-modal>
</template>
<script>
import ApproveConfigAddForm from './ApproveConfigForm'
export default {
  ...ApproveConfigAddForm
}
</script>
